<template>
  <div class="layui-row">
      <!-- 头部导航块 -->
      <top-lump>
 
          <span class="layui-breadcrumb kgo-top-lump-breadcrumb" lay-separator="#">
                <a># 新增项目</a>
          </span>
      </top-lump>
      <info-lump>
        <base-card title="新增项目">
            <table class="layui-table">
                <colgroup>
                    <col>
                    <col width="40%">
                    <col>
                    <col width="40%">
                </colgroup>
                <tbody>
                    <tr>
                        <td>项目名称</td>
                        <td class="kgo-input-td"><input v-model="projectName" name="projectName" type="text" class="kgo-input-text"/></td>
                        <td>项目简称</td>
                        <td class="kgo-input-td"><input  v-model="abbreviation" name="abbreviation" type="text" class="kgo-input-text"/></td>
                    </tr>
                    <tr>
                        <td>项目状态</td>
                        <td class="kgo-input-td"><alone-select catalogueCode="project_status" v-model="setSelect" name="status"></alone-select></td>
                        <td>项目类型</td>
                        <td class="kgo-input-td"><alone-select catalogueCode="project_type" v-model="setSelect" name="type"></alone-select></td>
                    </tr>
                    <tr>
                        <td>项目描述</td>
                        <td class="kgo-input-td"  colspan="3"><alone-textarea v-on:textarea="getTextarea" ref="remark" /></td>
                    </tr>
                     <tr>
                        <td>项目排序</td>
                        <td class="kgo-input-td"><input v-model="index"  name="index" type="text" class="kgo-input-text"/></td>
                        <td>项目描述</td>
                        <td class="kgo-button-td">
                            <div class="layui-btn-group">
                                <button class="layui-btn" v-on:click="addProject">增加</button>
                                <button class="layui-btn">编辑</button>
                                <button class="layui-btn">删除</button>
                            </div>
                        </td>
                    </tr>
                </tbody>
            </table>
        </base-card>

      </info-lump>
  </div>
</template>

<script>

import Edit from 'wangeditor'

export default {
    components: {

    },
    data () {
        return {
            editor:null,
            editTitle:"请输入标题",
            Url:this.$store.state.RootURL,
            projectName:'',
            abbreviation:'',
            status:'',
            type:'',
            index:0,
            remark:''
        }
    },
   methods:{
        selected:function(value){
            console.log(value);
            console.log(this.$store.state.count)
        },
        /**
         * 获取文本框的值
         */
        getTextarea:function(value){
           this.remark = value;
        },
         addProject:function(){
            if(this.projectName==null||this.projectName==""){
                layer.msg("工程名称不能为空！");
            }
            //触发获取文本域的方法
            this.$refs.remark.getTextarea();
            var project_obj = {
                "projectName":this.projectName,
                "abbreviation":this.abbreviation,
                "status":this.status,
                "type":this.type,
                "index":this.index,
                "remark":this.remark
            };

            var $ = layui.$;
            var url = this.$store.state.RootURL + "/project";
            $.post(url,project_obj,function(result){
                layer.msg(result.msg);
            },"json");
            console.log(JSON.stringify(project_obj));
        }
   },
   computed: {
        setSelect(){
          var selected = this.$store.state.aloneSelect;{
              if(selected["status"]){
                    console.log("状态 ：" + selected["status"]);
                    this.status = selected["status"];
              }if(selected["type"]){
                    console.log("类型 ：" + selected["type"]);
                    this.type = selected["type"];
              }
          }
        }
    }
}
</script>

<style lang="scss">
.kgo-input-text{
    height: 35px;
    width: 100%;
    border-radius: 5px;
    border: 1px solid #e6e6e6;
}
</style>
